$(() => {
    const layer = layui.layer;
    const form = layui.form;

    initArticleList();

    // 获取文章分类列表
    function initArticleList() {
        $.ajax({
            method: 'GET',
            url: '/my/article/cates',
            success: function (res) {
                const htmlStr = template('tpl-table', res);
                $('tbody').html(htmlStr);
            }
        });
    }

    // 添加类别事件
    let indexAdd = null;
    $("#btnAddCate").click(() => {
        indexAdd = layer.open({
            type: 1,
            title: '添加文章分类',
            content: $('#dialog-add').html(),
            area: ['500px', '250px']
        });
    });

    // 事件委托之提交事件
    $('body').on("submit", "#form-add", function (e) {
        e.preventDefault();
        $.ajax({
            method: 'POST',
            url: '/my/article/addcates',
            data: $(this).serialize(),
            success: function (res) {
                if (res.status !== 0) {
                    return layer.msg(res.message);
                }
                layer.msg(res.message);
                initArticleList();
                layer.close(indexAdd);
            }
        });
    });

    // 事件委托之点击编辑事件
    let indexEdit = null;
    $('tbody').on('click', '.btn-edit', function () {
        indexEdit = layer.open({
            type: 1,
            title: '编辑文章分类',
            content: $("#dialog-edit").html(),
            area: ['500px', '250px']
        });


        // 获取数据之一
        // 根据id获取对应的分类数据
        const id = $(this).attr('data-id');
        // $.ajax({
        //     method: 'GET',
        //     url: '/my/article/cates/' + id,
        //     success: function (res) {
        //         form.val('form-edit-filter', res.data);
        //         // console.log($("#edit-id").val(), res.data);
        //     }
        // });

        // 获取数据之二
        // 直接读取本地表格
        const data = {
            // 当前元素的父级之前的同辈元素,因此下标为倒序
            Id: id,
            name: $(this).parent().prevAll().eq(1).html(),
            alias: $(this).parent().prevAll().eq(0).html()
        }
        form.val('form-edit-filter', data);
        console.log('id:' + $("input[name='Id']").val());
    });

    // 事件委托之编辑文章分类
    $('body').on('submit', '#form-edit', function (e) {
        e.preventDefault();
        $.ajax({
            method: 'POST',
            url: '/my/article/updatecate',
            data: $(this).serialize(),
            success: function (res) {
                if (res.status !== 0) {
                    return layer.msg(res.message);
                }
                layer.msg(res.message);
                layer.close(indexEdit);
                initArticleList();
            }
        });
    });

    // 事件委托之点击删除事件
    let indexDelete = null
    $("tbody").on('click', '.btn-delete', function () {
        const id = $(this).attr('data-id');
        console.log(id);
        // 提示用户是否删除
        layer.confirm('是否删除?', { icon: 3, title: '提示' }, function (index) {
            $.ajax({
                method: 'GET',
                url: `/my/article/deletecate/${id}`,
                success: (res) => {
                    if (res.status !== 0) {
                        return layer.msg(res.message);
                    }
                    layer.msg(res.message);
                    layer.close(index);
                    initArticleList();
                }
            });
        });
    })
})